<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%String path = request.getContextPath();%>
<%@ taglib uri="/WEB-INF/tld/c.tld" prefix="c" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <c:set var="ctx" value="${pageContext.request.contextPath}"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>修改密码</title>
    <style>
        .disabledBtn {
            pointer-events: none;
            cursor: default;
            opacity: 0.6;
        }
    </style>
    <jsp:include page="../../import.jsp" flush="true"/>
</head>
<body class="iframeBody">
<div class="Wrapper">
    <form id="formSet1">
        <div class="fieldset1 tabel_col clearFix">
            <div class="fieldBox col_100_auto">
                <div class="label">原手机号</div>
                <div class="field">
                    <input name="oldMp" id="oldMp" type="input" class="ui-textbox" value="${usrMp}" disabled="true">
                </div>
            </div>
            <div class="fieldBox col_100_auto">
                <div class="label">新手机号</div>
                <div class="field">
                    <input name="newMp" id="newMp" type="newMp" class="ui-textbox" value=""
                           validate="{required:true, mobilePhone:true}">
                    <span class="requiredSymbol">*</span>
                </div>
            </div>
            <div class="fieldBox col_100_auto">
                <div class="label">验证码</div>
                <div class="field">
                    <input name="verifyCd" id="verifyCd" type="text" class="ui-textbox"
                           value="" placeholder="手机验证码" validate="{required:true, maxlength:4}">
                    <%--<button type="button" class="sq-button-round" onclick="getPhoneCode(this)">获取验证码</button>--%>
                    <span class="sq-button sq-button-round" onclick="getPhoneCode(this)">获取验证码</span>
                </div>
            </div>
        </div>
    </form>
</div>


<script type="text/javascript">
    $(function () {
        var formSet1 = $('#formSet1').ligerForm({
            validate: true
        });
        $("#verifyView").hide()
        SET_popupIframeHeight();
    });
    frameElement.dialog.onOk = function () {
        save(0);
    }
    frameElement.dialog.onCancel = function () {
        frameElement.dialog.close();
    }

    frameElement.dialog.onOkForIndex = function () {
        save(1);
    }

    function save(_flag) {
        var form = liger.get("formSet1");
        if (!form.valid()) {
            top.$.ligerDialog.SQalert({content: LogUtils.LOG_CMM_MUST_FIX_ITEM_INFO, SQ_type: "warning"});
            return false;
        }
        var newMp = $("#newMp").val();
        var verifyCd = $("#verifyCd").val();
        if (newMp == "" || newMp == null || newMp == undefined) {
            top.$.ligerDialog.SQalert({content: "请输入新手机号！", SQ_type: "warning"});
            return;
        }
        if (verifyCd == "" || verifyCd == null || verifyCd == undefined) {
            top.$.ligerDialog.SQalert({content: "请输入验证码！", SQ_type: "warning"});
            return;
        }
        var wait_dialog;
        $.ajax({
            type: 'post',
            dataType: 'json',
            data: {
                newMp: newMp,
                verifyCd: verifyCd
            },
            url: '<%=path%>/system/sysUsr/modifUsrMp.do',
            beforeSend: function () {
                wait_dialog = top.$.ligerDialog.SQalert({content: LogUtils.LOG_CMM_DATA_LOADING, SQ_type: "waitting"});
            },
            success: function (msg) {
                wait_dialog.close();
                if (msg.success == 1) {
                    top.$.ligerDialog.SQalert({content: msg.info, SQ_type: "success"});
                    frameElement.dialog.close();
                } else {
                    $("#verifyCd").val("");
                    top.$.ligerDialog.SQalert({content: msg.info, SQ_type: "error"});
                }
            }
        });
    }


    /*
        *获取手机验证码
        */
    function getPhoneCode(obj) {
        if (!$("#newMp").valid()) {
            return false;
        }
        var _newMp = $("#newMp").val();
        var _url = '<%=path%>/system/sysUsr/getAuthCd.do';
        $.ajax({
            type: 'get',
            dataType: 'json',
            data: {
                newMp: _newMp
            },
            url: _url,
            xhrFields: {
                withCredentials: true
            },
            success: function (msg) {
                if (msg.success == 1) {
                    top.$.ligerDialog.SQalert({content: msg.info, SQ_type: "success"});

                    settime(obj);
                } else {
                    top.$.ligerDialog.SQalert({content: msg.info, SQ_type: "error"});
                }
            }
        });
    }
    var countdown = 60;

    function settime(obj) { //发送验证码倒计时
        if (countdown == 0) {
            $(obj).removeClass("disabledBtn")
            $(obj).text("获取验证码");
            countdown = 60;
            return;
        } else {
            $(obj).addClass("disabledBtn")
            $(obj).text("重新发送(" + countdown + ")");
            countdown--;
        }
        setTimeout(function () {
            settime($(obj))
        }, 1000)
    }

    // 手机号码验证
    $.validator.addMethod("mobilePhone", function (value, element) {
        var length = value.length;
        var telReg = /^1\d{10}$/;
        return this.optional(element) || ((length == 11 && /^1[3|4|5|7|8]\d{9}$/.test(value)) || telReg.test(value));
    }, "手机号码格式错误!");
</script>


</body>
</html>
